<template>
  <div>

    <!-- 结果列表 -->
    <el-card>
      <el-table :data="leaveList"
                stripe
                style="width: 100%">
        <el-table-column label="#"
                         width="80">
          <template slot-scope="scope">
            <!-- (pageNo-1)*pageSize +index +1 -->
            {{scope.$index +1 }}
          </template>

        </el-table-column>
        <el-table-column prop="userName"
                         label="申请人 "
                         width="180">
        </el-table-column>
        <el-table-column prop="msg"
                         label="请假理由 "
                         width="180">
        </el-table-column>
        <el-table-column prop="type"
                         label="类型"
                         width="160">
        </el-table-column>
        <el-table-column prop="startTime"
                         label="开始时间">
        </el-table-column>
        <el-table-column prop="endTime"
                         label="结束时间">
        </el-table-column>
        <el-table-column label="审批"
                         width="200">
          <template slot-scope="scope">
            <div v-if="scope.row.isPass == 0">
              <el-button type="success"
                         round
                         size="mini"
                         @click="saveLeave(scope.row,1)"
                         value="1">通过</el-button>
              <el-button type="danger"
                         size="mini"
                         @click="saveLeave(scope.row,2)"
                         round
                         value="2">拒绝</el-button>
            </div>
            <div v-else>
              <el-button v-if="scope.row.isPass == 1"
                         type="success"
                         @click="saveLeave(scope.row,1)"
                         size="mini"
                         round
                         value="1">通过</el-button>
              <el-button v-else
                         type="danger"
                         size="mini"
                         @click="saveLeave(scope.row,2)"
                         round>拒绝</el-button>
            </div>
          </template>
        </el-table-column>

      </el-table>
    </el-card>

  </div>

</template>
	 
<script>
import leaveApi from '@/api/leave'

export default {
  data () {
    return {
      userid: '',
      //   type类型
      type: ["事假", "病假", "公假"],
      formLabelWidth: '130px',
      leaveForm: {},
      dialogFormVisible: false,
      title: '',
      total: 0,
      leaveList: [],
      rules: {
        msg: [
          { required: true, min: 2, max: 50, message: '长度在 2 到 50 个字符', trigger: 'blur' }
        ],
        type: [
          { required: true, message: '不能为空', trigger: 'blur' },
        ],
        startTime: [
          { required: true, message: '不能为空', trigger: 'blur' },
        ],
        endTime: [
          { required: true, message: '不能为空', trigger: 'blur' },
        ]
      }
    }
  },
  created () {
    this.getLeaveAllList()
  },
  methods: {
    saveLeave (leave, value) {
      console.log(leave);
      leave.isPass = value
      // 把提交请求给后台 
      leaveApi.saveLeave(leave).then((respone) => {
        // 成功提示
        this.$message({
          message: respone.message,
          type: 'success'
        });
        this.getLeaveAllList()
      })
    },
    getLeaveAllList () {
      leaveApi.getLeaveAllList().then(res => {
        this.leaveList = res.data
      })
    }
  },
}
	 </script>
	 
	 <style>
#search .el-input {
  width: 200px;
  margin-right: 10px;
}
.el-dialog .el-input {
  width: 80%;
}
</style>